<template>
 
 <h1>用户注册</h1>
  <el-row :gutter="20">
    <el-col :span="5"><div class="grid-content ep-bg-purple"></div> </el-col>
    <el-col :span="10">
        <el-form :model="form"  label-width="120px">
            <el-form-item label="用户名">
                <el-input v-model="user.name" />
            </el-form-item>
            <el-form-item label="密码">
                <el-input v-model="user.password" />
            </el-form-item>
            <el-form-item>
                <el-button type="primay" @click="register">注册</el-button>
            </el-form-item>
        </el-form>
    </el-col>
    <el-col :span="5"><div class="grid-content ep-bg-purple"></div></el-col>
  </el-row>
</template>

<script>
import axios from 'axios'
import { ElMessage, ElMessageBox } from 'element-plus'
export default {

    data(){
        return{
            user:{
                name:'',
                password:''
            }
        }
    },
    methods:{
        register(){
            axios.post('http://localhost:8000/register',JSON.stringify(this.user),{headers:{
                'Content-Type':'application/json;charset=UTF-8',
            },}).then(
                (res) =>{
                    console.log(res)
                    var data = res.data.split(",");
                    if(data[0]==200)
                    {
                         ElMessageBox.alert(data[1], '提示', {
   
                         confirmButtonText: 'OK',
   
                         })
                        this.$router.push('/user');
                    }else{
                     ElMessageBox.alert(data[1], '提示', {
   
                         confirmButtonText: 'OK',
   
                    })
                    }
                }
            )
        }
    }

}
</script>

<style>

</style>